import React, { Component } from "react";
import ReactEcharts from 'echarts-for-react'


export default class line extends Component {
  state = {
    aData: [7.0, 6.9, 9.5, 14.5, 18.4, 21.5,25.2,26.5,23.3,18.3,13.9,9.6],
    bData: [3.9, 4.2, 5.7, 8.5, 11.9, 15.2,17,16.6,14.2,10.3,6.6,4.8],
    cData:[5.9,1.9,3.9,5.5,8.9,10.0,12.9,15.9,20.7,20.9,30.9,35.9]
  }
  getOption = () => {
    const { aData, bData,cData } = this.state
    return {
      tooltip: {},
      grid:{
        top:20
      },
      legend: {
        data: ['a','b','c'],
        bottom:20,
        icon:'roundRect'
      },
     
      xAxis: {
        data: ["Jan", "Feb", "Mar", "Apr", "May", "Jun",'Jul','Aug','Sep','Oct','Nov','Dec']
      },
      yAxis: {
        type: 'value',
        axisLabel:{
          show:true,
          formatter: '{value} 万个'
        }
      },
      series: [{
        name: 'a',
        type: 'line',
        data: aData,
        label: {
          show: true
        }
      }, {
        name: 'b',
        type: 'line',
        data: bData,
        label: {
          show: true
        }
      },
      {
        name: 'c',
        type: 'line',
        data: cData,
        label: {
          show: true
        }
      }
    ]
    }
  }

  render() {
    // 数据源
    return (
      <div style={{  height: 300 }}>
          <ReactEcharts option={this.getOption()} style={{ height: 250 }} />
      </div>
    );
  }
}
